<template>
  <div style="background-color: white; height: 32px">
    <a-tabs size="mini" v-model:active-key="activePage">
      <a-tab-pane key="ProductSPU" title="SPU"></a-tab-pane>
      <a-tab-pane key="ProductSKU" title="SKU"></a-tab-pane>
      <!-- <a-tab-pane key="RecycleBinSKU" title="SKU回收站"></a-tab-pane> -->
    </a-tabs>
  </div>
  <component :is="activePage"></component>
</template>

<script lang="ts">
  import { ref, defineComponent } from 'vue'
  import ProductSPU from './productSPU.vue'
  import ProductSKU from './productSKU.vue'
  import RecycleBinSKU from './recycleBinSKU.vue'
  export default defineComponent({
    components: {
      ProductSPU,
      ProductSKU,
      RecycleBinSKU,
    },
    setup() {
      let activePage = ref('ProductSPU')
      return {
        activePage,
      }
    },
  })
</script>

<style lang="less" scoped></style>
